<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
    	<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	    <title>发货日报表</title>
	    <meta name="description" content="防伪溯源">
	    <link rel="stylesheet" href="css/AllStyle.css" />
	    <link rel="stylesheet" href="css/iconfont.css" />
	    <script type="text/javascript" src="js/common.js" ></script>
	    <script type="text/javascript" src="js/companydata.js" ></script>
	    <script type="text/javascript" src="js/data.js" ></script>
	    <script type="text/javascript" src="js/tmpl.js" ></script>
	</head>
	<body>
		<!-- 页头 -->
	    <section>
		    <script type="text/javascript">
		        AllPageHeader()
		    </script>
	    </section>
	    
	    <!-- 页面  -->
	    <section class="AllContent" style="background-color: #fff;">
	    	
	    	<img id="LoadingImg" style="width: 40%;margin:20px auto;display:block;" src="images/loading5.gif" />
	    	
	    	<div style="width:100%;height:350px;overflow: hidden;"><div id="main" style="width:100%; height:400px;margin-top:-50px;"></div></div>
	    	
	    	<!-- 信息 -->
			<div class="ScanNav">
				<ul>
					<li>扫码城市</li>
					<li>数量</li>
					<li>占比</li>
				</ul>
			</div>
				
			<div id="Scanlist">

            </div>
	    </section>
	</body>
	<script type="text/javascript" src="js/jquery.min.js" ></script>
	<script type="text/javascript" src="js/mui.min.js" ></script>
	<script type="text/javascript" src="js/echarts.min.js" ></script>
	<script type="text/javascript" src="js/china.js" ></script>
	<script type="text/javascript">
		$('.AllHeader li:eq(1)').text('扫描统计')
		
        function GetDateStr(AddDayCount) {
            var dd = new Date();
            dd.setDate(dd.getDate()+AddDayCount);//获取AddDayCount天后的日期
            var y = dd.getFullYear();
            var m = dd.getMonth()+1;//获取当前月份的日期
            var d = dd.getDate();
            return y+"-"+m+"-"+d;
        }
        datas = new Array();
        
        $(function () {
        	var myChart = echarts.init(document.getElementById('main'));
        	
            $.ajax({
                type: "post",
                url:  getServerUrl()+"/Open/ComStat/Mapstat",
                dataType: 'json',
                data:'access_token='+getToken(),
                success: function (json) {
                    if (json.result == "1") {
                        var clist = json.data;
                        var chtml = ''
                        if (!empty(clist)) {
                            for (var i = 0; i < clist.length; i++) {
                                if (!empty(clist[i])) {
                                    if(!empty(clist[i].value)){
                                        chtml = chtml +'<ul>'
												+'<li>' + clist[i].name + '</li>'
												+'<li>' + clist[i].value + '</li>'
												+'<li>' + clist[i].percent + '</li>'
												+'</ul>';
                                    }
                                    var arr = {name:clist[i].name,value:clist[i].value};
                                    datas.push(arr);
                                }
                            }
                        }
                        $("#Scanlist").append(chtml);
                        $('#LoadingImg').hide();
						
                        function randomData() {
						    return Math.round(Math.random()*1000);
						}
						
						option = {
							backgroundColor: '#404a59',
						    tooltip: {
						        trigger: 'item'
						    },
						    visualMap: {
						        min: 0,
						        max: 50,
						        itemHeight:100,
						        calculable: true,
						        color: ['#d94e5d','#eac736','#50a3ba','#626364'],
						        range: [0,50],
						    	borderColor: '#fff',
						        textStyle: {
						            color: '#fff'
						        }
						    },
						    toolbox: {
						        show: true,
						        orient: 'vertical',
						        left: 'right',
						        top: 'center'
						    },
						    series: [
						        {
						            name: '扫码次数',
						            type: 'map',
                                    mapType: 'china',
                                    roam: true,
                                    scaleLimit:{min:1,max:5},
                                    data: datas
						        }
						    ]
						};
			        	myChart.setOption(option);
                    }
                }
            });
        });
        function onDeviceReady() {
            document.addEventListener("backbutton", onBackKeyDown, false);
        }
        function onBackKeyDown() {
            openUrl("index.html");
        }
	</script>
</html>
